<div class="white-bg padding-lg padding-top border-radius">
    <div class="flex justify-between">
        <div class="text-title">
            充电桩信息
        </div>
        <div>
            <button type="button" class="btn btn-white btn-sm" style="margin-left:10px"  v-on:click="vc.goBack()">
                返回
            </button>
        </div>
    </div>
    <!-- 业主信息 -->
    <div class="margin-top">
        <div class="row" >
            <div class="col-sm-12">
                <div class="row">
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label class="col-form-label">
                                <vc:i18n name="充电桩ID：" namespace="adminChargeDetailInfo"></vc:i18n>
                            </label>
                            <label class="">{{adminChargeDetailInfo.machineId}}</label>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label class="col-form-label">
                                <vc:i18n name="充电桩名称：" namespace="adminChargeDetailInfo"></vc:i18n>
                            </label>
                            <label class="">{{adminChargeDetailInfo.machineName}}</label>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label class="col-form-label">
                                <vc:i18n name="充电桩编号：" namespace="adminChargeDetailInfo"></vc:i18n>
                            </label>
                            <label class="">{{adminChargeDetailInfo.machineCode}}</label>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label class="col-form-label">
                                <vc:i18n name="厂家名称:" namespace="adminChargeDetailInfo"></vc:i18n>
                            </label>
                            <label class="">{{adminChargeDetailInfo.factoryName}}</label>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label class="col-form-label">
                                <vc:i18n name="充电类型:" namespace="adminChargeDetailInfo"></vc:i18n>
                            </label>
                            <label class="">{{adminChargeDetailInfo.chargeTypeName}}</label>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label class="col-form-label">
                                <vc:i18n name="插槽个数:" namespace="adminChargeDetailInfo"></vc:i18n>
                            </label>
                            <label class="">{{adminChargeDetailInfo.portCount}}</label>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label class="col-form-label">
                                <vc:i18n name="充电规则" namespace="adminChargeDetailInfo"></vc:i18n>
                            </label>
                            <label class=""> {{adminChargeDetailInfo.ruleName}}</label>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label class="col-form-label">
                                <vc:i18n name="状态" namespace="adminChargeDetailInfo"></vc:i18n>
                            </label>
                            <label class=""> {{adminChargeDetailInfo.stateName}}</label>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label class="col-form-label">
                                <vc:i18n name="心跳时间" namespace="adminChargeDetailInfo"></vc:i18n>
                            </label>
                            <label class=""> {{adminChargeDetailInfo.heartbeatTime}}</label>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label class="col-form-label">
                                <vc:i18n name="添加时间" namespace="adminChargeDetailInfo"></vc:i18n>
                            </label>
                            <label class=""> {{adminChargeDetailInfo.createTime}}</label>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="vc-line-primary margin-top"></div>
    <div class="margin-top-sm">
        <ul class="nav nav-tabs">
            <li class="nav-item">
                <a class="nav-link" v-bind:class="{active:adminChargeDetailInfo._currentTab == 'adminChargeDetailPort'}" v-on:click="changeTab('adminChargeDetailPort')">
                    <vc:i18n name="插槽" namespace="adminChargeDetail"></vc:i18n>
                </a>
            </li>
            <li class="nav-item" v-if="adminChargeDetailInfo.chargeType == '1001'">
                <a class="nav-link" v-bind:class="{active:adminChargeDetailInfo._currentTab == 'adminChargeDetailRule'}" v-on:click="changeTab('adminChargeDetailRule')">
                    <vc:i18n name="充电规则" namespace="adminChargeDetail"></vc:i18n>
                </a>
            </li>
            <li class="nav-item" v-if="adminChargeDetailInfo.chargeType == '1002'">
                <a class="nav-link" v-bind:class="{active:adminChargeDetailInfo._currentTab == 'adminChargeDetailPrice'}" v-on:click="changeTab('adminChargeDetailPrice')">
                    <vc:i18n name="充电规则" namespace="adminChargeDetail"></vc:i18n>
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link" v-bind:class="{active:adminChargeDetailInfo._currentTab == 'adminChargeDetailOrder'}" v-on:click="changeTab('adminChargeDetailOrder')">
                    <vc:i18n name="充电订单" namespace="adminChargeDetail"></vc:i18n>
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link" v-bind:class="{active:adminChargeDetailInfo._currentTab == 'adminChargeDetailParking'}" v-on:click="changeTab('adminChargeDetailParking')">
                    <vc:i18n name="停车券" namespace="adminChargeDetail"></vc:i18n>
                </a>
            </li>
            <li class="nav-item" v-if="adminChargeDetailInfo.acctId">
                <a class="nav-link" v-bind:class="{active:adminChargeDetailInfo._currentTab == 'adminChargeDetailAcct'}" v-on:click="changeTab('adminChargeDetailAcct')">
                    <vc:i18n name="账户详情" namespace="adminChargeDetail"></vc:i18n>
                </a>
            </li>
            <li class="nav-item" v-if="adminChargeDetailInfo.orderId">
                <a class="nav-link" v-bind:class="{active:adminChargeDetailInfo._currentTab == 'adminChargeDetailOrderAccts'}" v-on:click="changeTab('adminChargeDetailOrderAccts')">
                    <vc:i18n name="扣款明细" namespace="adminChargeDetail"></vc:i18n>
                </a>
            </li>
        </ul>
    </div>
     <div v-if="adminChargeDetailInfo._currentTab == 'adminChargeDetailPort'">
        <vc:create path="charge/adminChargeDetailPort"></vc:create>
    </div>
    <div v-if="adminChargeDetailInfo._currentTab == 'adminChargeDetailRule'">
        <vc:create path="charge/adminChargeDetailRule"></vc:create>
    </div>

    <div v-if="adminChargeDetailInfo._currentTab == 'adminChargeDetailPrice' ">
        <vc:create path="charge/adminChargeDetailPrice"></vc:create>
    </div>

    <div v-if="adminChargeDetailInfo._currentTab == 'adminChargeDetailOrder'">
        <vc:create path="charge/adminChargeDetailOrder"></vc:create>
    </div>

    <div v-if="adminChargeDetailInfo._currentTab == 'adminChargeDetailParking'">
        <vc:create path="charge/adminChargeDetailParking"></vc:create>
    </div>

    <div v-if="adminChargeDetailInfo._currentTab == 'adminChargeDetailAcct'">
        <vc:create path="charge/adminChargeDetailAcct"></vc:create>
    </div>
    <div v-if="adminChargeDetailInfo._currentTab == 'adminChargeDetailOrderAccts'">
        <vc:create path="charge/adminChargeDetailOrderAccts"></vc:create>
    </div>
    
</div>